package com.lzgcoding.onlineshopapp.feature.main.dashboard.component

import androidx.annotation.DrawableRes
import androidx.compose.foundation.Image
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import com.lzgcoding.onlineshopapp.R
import com.lzgcoding.onlineshopapp.ui.theme.LargePadding
import com.lzgcoding.onlineshopapp.ui.theme.MediumPadding

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun DashboardTopBar(
    @DrawableRes profileIcon: Int,
    username: String
) {
    TopAppBar(
        navigationIcon = {
            Image(
                painter = painterResource(profileIcon),
                contentDescription = "profile_icon"
            )
        },
        title = {
            Column(
                modifier = Modifier.padding(start = MediumPadding)
            ) {
                Text(
                    text = stringResource(R.string.str_welcome_back),
                    style = MaterialTheme.typography.bodyMedium,
                    color = Color.Gray
                )
                Text(
                    text = username,
                    style = MaterialTheme.typography.titleMedium
                )
            }
        },
        actions = {
            Image(
                painter = painterResource(R.drawable.cart_icon),
                contentDescription = "cart_icon",
                modifier = Modifier
//                    .clip(CircleShape)
                    .clickable {},
//                contentScale = ContentScale.Crop
            )
            Spacer(Modifier.width(LargePadding))
            Image(
                painter = painterResource(R.drawable.bell_icon),
                contentDescription = "bell_icon",
                modifier = Modifier
//                    .clip(CircleShape)
                    .clickable {},
//                contentScale = ContentScale.Crop
            )
        }
    )
}